<?php echo $this->load->view('header_open.php'); ?>
<link type="text/css" href="<? echo base_url(); ?>css/smoothness/jquery-ui-1.7.1.custom.css" rel="stylesheet" />
<script type="text/javascript" src="<? echo base_url(); ?>js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="<? echo base_url(); ?>js/jquery-ui-1.7.1.custom.min.js"></script>

<link rel="stylesheet" type="text/css" href="<? echo base_url(); ?>shadowbox/shadowbox.css">
<script type="text/javascript" src="<? echo base_url(); ?>shadowbox/shadowbox.js"></script>
<script type="text/javascript">
Shadowbox.init({
	language: 'en',
	players:  ['img', 'html', 'iframe']
});
</script>
<style type="text/css">
	#category { clear:left; }
	#category ul{ list-style-type: none; margin: 0; float: left; margin-right: 10px;  background: #eee; padding: 5px; width: 100%;}
	#category ul li { margin: 5px 5px 5px 5px; float: left; width: 135px; }
	#category .ui-state-highlight { height: 85px; border-color:#3baf0d; }
	
	#category img{
		border:none;
	}
	
	#category #photo{
		border:solid 1px #000000;
		background-color:#FFFFFF;
		text-align:left;
		width:125px;
		overflow:hidden;
		padding:5px;
		margin:0px 5px 0px 5px;
	}
	#category #photo #photo_in{
		float:left;	
	}
	#category #photo #photo_out{
		float:right;
		overflow:hidden;
	}
	
	#category #photo #photo_out #move{
		float:left;		
		cursor:move;
	}
	
	#category #photo #photo_out #view, #category #photo #photo_out #edit{
		clear:left;
		float:left;
		margin-top:5px;	
	}


	</style>
	<script type="text/javascript">
	$(document).ready(function() {

		$("#category_<?php echo $category->category_id; ?>").sortable({
			connectWith: '.photos',
			placeholder: 'ui-state-highlight',
			cursor: 'move',
			handle: '#move',
			revert: true,
			update : function () { 
      			var order = $('#category_<?php echo $category->category_id; ?>').sortable('serialize') + '&category_id=<?php echo $category->category_id; ?>&action=change'; 
		      	//$("#info").load("<?php echo site_url('photo/change_position'); ?>", order); 
				$.post("<?php echo site_url('photo/change_position'); ?>", order, function(theResponse){
				$("#msg").html(theResponse);
				$("#msg").fadeIn("fast");
				setTimeout(function(){$("#msg").fadeOut("slow", function(){});}, 2000);
			}); 
    	}
		}).disableSelection();

		$(".sideNavItem").droppable({
			accept: "#category_<?php echo $category->category_id; ?> li",
			hoverClass: "drop",
			revert: true,
			drop: function(event, ui) {
				var $photo = ui.draggable;
				var photo_id=$photo.attr('id').split('_'); 
				photo_id = photo_id[1];
				var category_id = $(this).attr('id');
				var order = 'category_id='+category_id+'&photo_id='+photo_id;
				$.post("<?php echo site_url('photo/change_category'); ?>", order, function(theResponse){
				$("#msg").html(theResponse);
				$("#msg").fadeIn("fast");
				if(status==0){$("#item_"+photo_id).hide("explode", 1000);}
				setTimeout(function(){$("#msg").fadeOut("slow", function(){});}, 2000);
				});
			}
		});
		
		$(".sideNavDel").droppable({
			accept: "#category_<?php echo $category->category_id; ?> li",
			hoverClass: "drop",
			revert: true,
			drop: function(event, ui) {
				var $photo = ui.draggable;
				var photo_id=$photo.attr('id').split('_'); 
				photo_id = photo_id[1];
				$("#item_"+photo_id).hide("explode", 1000);
				var order = 'photo_id='+photo_id;
				$.post("<?php echo site_url('photo/delete'); ?>", order, function(theResponse){
					$("#msg").html(theResponse);
					$("#msg").fadeIn("fast");
					setTimeout(function(){$("#msg").fadeOut("slow", function(){});}, 2000);
				});
			}
		});
	});
	
$().ajaxSend(function(r,s){  
	$("#loading").show();  
});  
  
$().ajaxStop(function(r,s){  
	$("#loading").fadeOut("fast");  
}); 




	</script>
<?php echo $this->load->view('header_close.php'); ?>
<?php
$items = array();
$i = 0;
foreach ($categories as $c){
	$items[$i] = anchor('photo/main/'.$c->category_id,$c->name, array('class'=>'sideNavItem', 'id'=>$c->category_id));
	$i++;
}
$items[$i] = anchor('photo/create/'.$c->category_id,'+ New upload', array('class'=>'active'));
$i++;
//$items[$i] = anchor('photo/delete/','- Drop here 2 delete', array('class'=>'sideNavDel'));
$data['items'] = $items;
echo $this->load->view('body_open.php',$data);
?>
<h3><?php echo $category->name; ?></h3>
<?php
$path = base_url().'data/photo/';
?>

<div id="category">
	<ul id="category_<?php echo $category->category_id; ?>" class="connectedSortable">
<?php
	$i = 0;
	foreach ($photos as $b)
	{
		$i++;
		echo '<li id="item_'.$b->photo_id.'">';
		echo '<div id="photo"><div id="photo_in">'.
			//'<a href="'.$path.$b->photo_id.'.jpg" rel="shadowbox['.$b->category_id.']" title="'.$b->name.'">'.
			'<img src="'.$path.$b->photo_id.'_thumb.jpg" title="'.$b->name.'" /></div>';
			//'</a>';
		echo '<div id="photo_out">';
		echo '<div id="move"><img src="'.base_url().'img/view-fullscreen.png" title="Move" alt="Move" /></div>';
		echo '<div id="view">'.
			'<a href="'.$path.$b->photo_id.'.jpg" rel="shadowbox" title="'.$b->name.'">'.
			'<img src="'.base_url().'img/edit-find.png" /></div>'.
			'</a>';
		echo '<div id="edit"><a rel="shadowbox;height=140;width=120;player=iframe" href="'.site_url('photo/edit').'" title="Edit"><img src="'.base_url().'img/format-justify-fill.png" title="Edit" alt="Edit" /></a></div>';
		echo '</div>';
		echo '</div>';
		echo '</li>';	
	}
?>
	</ul>
</div>
<!-- div category -->

<?php echo $this->load->view('body_close.php'); ?>
